<div>
    <div class="overlay">
    </div>
    <div class="login">
        <div class="login_lt">
            <img src="<?php echo IMG_PATH ?>index/logo_bg.png"/>
        </div>
        <div class="login_rg">
            <div class="close">╳</div>
            <div class="tab_wr">
                <div class="tab_tit">
                    <a href="javascript:;" class="log on">登录</a>
                    <a href="javascript:;" class="reg">注册</a>
                </div>
                <div class="tab_cn log_c" style="display: inline-block">
                    <div style="display: flex">
                        <div>
                            <h2>请填写登录信息</h2>
                            <form id="loginForm">
                                <div class="infor_box">
                                    <div class="account">
                                        <input type="hidden" name="refer" id="refer" value="123">
                                        <input type="text" name="phone" placeholder="请输入您的手机号">
                                        <b>
                                            <svg t="1535421301469" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2988" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="25"><path d="M512 533.333333c132.266667 0 243.2-110.933333 243.2-247.466666S644.266667 42.666667 512 42.666667 268.8 153.6 268.8 285.866667s110.933333 247.466667 243.2 247.466666z m0-413.866666c89.6 0 166.4 76.8 166.4 170.666666s-72.533333 170.666667-166.4 170.666667-166.4-76.8-166.4-170.666667 76.8-170.666667 166.4-170.666666zM712.533333 580.266667c-29.866667-17.066667-68.266667-12.8-93.866666 8.533333-21.333333 17.066667-55.466667 42.666667-102.4 42.666667-38.4 0-72.533333-12.8-110.933334-42.666667-25.6-21.333333-59.733333-25.6-89.6-8.533333-93.866667 46.933333-217.6 132.266667-217.6 324.266666 0 42.666667 38.4 81.066667 81.066667 81.066667h657.066667c42.666667 0 81.066667-38.4 81.066666-81.066667 4.266667-179.2-102.4-264.533333-204.8-324.266666z m128 324.266666H183.466667c-4.266667 0-4.266667-4.266667-4.266667-4.266666 0-145.066667 89.6-209.066667 174.933333-256h8.533334c51.2 38.4 102.4 59.733333 157.866666 59.733333 72.533333 0 123.733333-34.133333 153.6-59.733333h4.266667c102.4 59.733333 170.666667 128 170.666667 256-4.266667 4.266667-4.266667 4.266667-8.533334 4.266666z" p-id="2989"></path></svg>
                                        </b>
                                    </div>
                                    <div class="password"><input type="password" name="password" placeholder="请输入您的密码">
                                        <b>
                                            <svg t="1535421398352" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4198" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="25"><path d="M850.5 409.6l0-68.3C850.5 152.8 698.9 0 512 0 325.1 0 173.5 152.8 173.5 341.3l0 68.3L76.8 409.6l0 468.1c0 80.8 64.9 146.3 145.1 146.3l580.3 0c80.1 0 145.1-65.5 145.1-146.3L947.3 409.6 850.5 409.6zM256 349.9c0-150.8 116.2-273.1 259.5-273.1 153.6 0 252.5 131 252.5 292.6l0 40.2L256 409.6 256 349.9zM870.4 811.7c0 107.9-26.4 135.5-128 135.5L281.6 947.2c-102 0-128-27.2-128-135.5L153.6 486.4l716.8 0L870.4 811.7z" p-id="4199"></path><path d="M512 819.2c28.3 0 51.2-22.9 51.2-51.2L563.2 665.6c0-28.3-22.9-51.2-51.2-51.2-28.3 0-51.2 22.9-51.2 51.2L460.8 768C460.8 796.3 483.7 819.2 512 819.2z" p-id="4200"></path></svg>
                                        </b>
                                    </div>
                                </div>
                            </form>
                            <!-- <div class="infor_tip">
                                <div class="automatic on">
                                    <b></b>
                                </div>
                                <div class="forget">
                                    <a href="javascript:">忘记密码？</a>
                                </div>
                            </div> -->
                        </div>
                        <!-- <div class="l_third" >
                            <div>
                                <h6>第三方登录</h6>
                                <a href="javascript:;" class="qq">QQ登录</a>
                                <a href="javascript:;" class="wx">微信登录</a>
                                <a href="" class="alipay">支付宝登录</a>
                            </div>
                        </div> -->
                    </div>

                    <div class="login_btn">
                        <button id="loginBtn">登录</button>
                    </div>
                </div>
                <div class="tab_cn reg_c">
                    <div style="display: flex;">
                        <div>
                            <h2>请填写注册信息息</h2>
                            <form id="regForm">
                                <div class="infor_box">
                                    <div class="phone_num">
                                        <input type="text" placeholder="请输入手机号" name="phone" id="phone" />
                                        <b>
                                            <svg t="1535443925203" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5615" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="25"><path d="M751.036141 162.03542 272.962835 162.03542l0 617.511056 478.073306 0L751.036141 162.03542zM561.799196 112.236224c0-5.477758-4.482081-9.959839-9.959839-9.959839l-99.598392 0c-5.477758 0-9.959839 4.482081-9.959839 9.959839l0 9.959839c0 5.477758 4.482081 9.959839 9.959839 9.959839l99.598392 0c5.477758 0 9.959839-4.482081 9.959839-9.959839L561.799196 112.236224zM512 899.064546c21.912056 0 39.839357-17.927301 39.839357-39.839357s-17.927301-39.839357-39.839357-39.839357c-21.912056 0-39.839357 17.927301-39.839357 39.839357S490.087944 899.064546 512 899.064546zM751.036141 958.823582 272.962835 958.823582c-32.867572 0-59.759035-26.891464-59.759035-59.759035L213.2038 122.196063c0-32.867572 26.891464-59.759035 59.759035-59.759035l478.073306 0c32.867572 0 59.759035 26.891464 59.759035 59.759035l0 776.868483C810.795177 931.932118 783.903713 958.823582 751.036141 958.823582z" p-id="5616"></path></svg>
                                        </b>
                                    </div>
                                    <div class="verify">
                                        <input type="text" placeholder="请输入验证码" name="captcha" id="captcha" />
                                        <i class="getCode">获取验证码</i>
                                        <i class="seconds hide"></i>
                                    </div>
                                    <div class="password">
                                        <input type="password" placeholder="请输入密码（至少6位）" name="password_one" id="password_one">
                                        <b>
                                            <svg t="1535421398352" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4198" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="25"><path d="M850.5 409.6l0-68.3C850.5 152.8 698.9 0 512 0 325.1 0 173.5 152.8 173.5 341.3l0 68.3L76.8 409.6l0 468.1c0 80.8 64.9 146.3 145.1 146.3l580.3 0c80.1 0 145.1-65.5 145.1-146.3L947.3 409.6 850.5 409.6zM256 349.9c0-150.8 116.2-273.1 259.5-273.1 153.6 0 252.5 131 252.5 292.6l0 40.2L256 409.6 256 349.9zM870.4 811.7c0 107.9-26.4 135.5-128 135.5L281.6 947.2c-102 0-128-27.2-128-135.5L153.6 486.4l716.8 0L870.4 811.7z" p-id="4199"></path><path d="M512 819.2c28.3 0 51.2-22.9 51.2-51.2L563.2 665.6c0-28.3-22.9-51.2-51.2-51.2-28.3 0-51.2 22.9-51.2 51.2L460.8 768C460.8 796.3 483.7 819.2 512 819.2z" p-id="4200"></path></svg>
                                        </b>
                                    </div>
                                    <div class="password">
                                        <input type="password" placeholder="请确认密码" class="a" name="password_two" id="password_two">
                                        <b>
                                            <svg t="1535421398352" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4198" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="25"><path d="M850.5 409.6l0-68.3C850.5 152.8 698.9 0 512 0 325.1 0 173.5 152.8 173.5 341.3l0 68.3L76.8 409.6l0 468.1c0 80.8 64.9 146.3 145.1 146.3l580.3 0c80.1 0 145.1-65.5 145.1-146.3L947.3 409.6 850.5 409.6zM256 349.9c0-150.8 116.2-273.1 259.5-273.1 153.6 0 252.5 131 252.5 292.6l0 40.2L256 409.6 256 349.9zM870.4 811.7c0 107.9-26.4 135.5-128 135.5L281.6 947.2c-102 0-128-27.2-128-135.5L153.6 486.4l716.8 0L870.4 811.7z" p-id="4199"></path><path d="M512 819.2c28.3 0 51.2-22.9 51.2-51.2L563.2 665.6c0-28.3-22.9-51.2-51.2-51.2-28.3 0-51.2 22.9-51.2 51.2L460.8 768C460.8 796.3 483.7 819.2 512 819.2z" p-id="4200"></path></svg>
                                        </b>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="register" >
                            <div>
                                <button id="regBtn">立即注册</button>
                                <p>已有账号? <a href="javascript:;" id="reg_on">立即登录</a> </p>
                            </div>
                            <b></b>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    $(function(){
        /*仿刷新：检测是否存在cookie*/  
        // if($.cookie("captcha")){  
        //     var count = $.cookie("captcha");  
        //     var btn = $('.getCode');  
        //     btn.val(count+'s').attr('disabled',true);  
        //     var resend = setInterval(function(){  
        //         count--;  
        //         if (count > 0){  
        //             btn.html(count+'s').attr('disabled',true);
        //             $.cookie("captcha", count, {path: '/', expires: (1/86400)*count});  
        //         }else {  
        //             clearInterval(resend);  
        //             btn.html("获取验证").removeClass('disabled').removeAttr('disabled style');  
        //         }  
        //     }, 1000);  
        // }  

        //发送验证码
        $(".getCode").click(function(){
            var phone = $("#phone").val();
            if(!phone) {
                layer.msg('请输入您的手机号');
                return false;
            }

            var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/; 
            if(!myreg.test(phone)) { 
                layer.msg('请输入正确的手机号码'); 
                return false; 
            } 

            //检测手机号是否已被注册
            var url = "<?php echo U('login/checkPhoneRegister') ?>";
            $.post(url, {phone:phone}, function(result){
                if(result.status) {
                     sendMessage(phone);
                } else{
                    layer.msg(result.info); 
                    return false;
                }
            },"JSON");

        });

        /*点击改变按钮状态，已经简略掉ajax发送短信验证的代码*/  
        function sendMessage(phone) {
            var sendurl = "<?php echo U('login/sendMessage') ?>";
            $.post(sendurl , {phone : phone} , function(result){
                setBtndisabled();
                // if(result.status) {
                //     // layer.msg('短信已成功发送，请注意查收');
                // }else{
                //     layer.msg(result.info);
                //     return false;
                // }
            }, "JSON"); 
        }


        function setBtndisabled() {
            var btn = $(".seconds");
            var sendbtn = $(".getCode");  
            var count = 60;  
            var resend = setInterval(function(){  
                count--;  
                if (count > 0){ 
                    btn.removeClass('hide'); 
                    btn.html("重新获取("+count+")");  
                    sendbtn.addClass('hide');
                    // $.cookie("captcha", count, {path: '/', expires: (1/86400)*count});  
                }else {  
                    clearInterval(resend); 
                    sendbtn.html("获取验证码");  
                    sendbtn.removeClass('hide');
                    btn.addClass('hide');
                }  
            }, 1000);
        }


        //注册提交
        $("#regBtn").click(function(){
            $(this).attr('disabled' , true);
            var regUrl = "<?php echo U('login/register') ?>";
            $.post(regUrl , $("#regForm").serialize() , function(result){
                if(result.status){
                    layer.msg(result.info);
                    setTimeout(function () {
                      window.location.reload();
                    }, 2000);
                }else{
                    layer.msg(result.info);
                    $("#regBtn").attr('disabled' , false);
                    return false;
                }
            },'json');
        });


        //用户登录
        $("#loginBtn").click(function(){
            $(this).attr('disabled' , true);
            var loginUrl = "<?php echo U('login/ajaxLogin') ?>";
            $.post(loginUrl , $("#loginForm").serialize(), function(result){
                if(result.status){
                    layer.msg(result.info);
                    setTimeout(function () {
                        if(result.data) {
                            // console.log(result.data);
                            window.location.href = result.data;
                        }else{
                            window.location.reload();
                        }
                      
                    }, 2000);
                }else{
                    layer.msg(result.info);
                    $("#loginBtn").attr('disabled' , false);
                    return false;
                }
            },'json');
        });

        //回车登录
        $("#loginForm").keydown(function(e){
             var e = e || event,
             keycode = e.which || e.keyCode;
             if (keycode==13) {
                $("#loginBtn").trigger("click");
             }
        });



        $(".tab_tit a").click(function(){
            var n=$(this).index();
            $(this).addClass("on").siblings("a").removeClass("on");
            $(".tab_cn").eq(n).show().siblings(".tab_cn").hide();
        });

        $("input").focus(function(){
            $(this).parents().addClass("key");
        });

        $("input").blur(function(){
            $(this).parent().removeClass("key");
        });

        $("#login").click(function(){
            resetLoginForm();
            $(".login, .overlay").addClass("pop_in");
            $(".log").addClass("on");
            $(".log_c").show();
            $(".reg").removeClass('on');
            $(".reg_c").hide();
        });

        $("#register").click(function(){
            resetLoginForm();
            $(".login, .overlay").addClass("pop_in");
            $(".log").removeClass("on");
            $(".log_c").hide();
            $(".reg").addClass('on');
            $(".reg_c").show();
        });

        $("#reg_on").click(function(){
            $(".log").addClass("on");
            $(".log_c").show();
            $(".reg").removeClass('on');
            $(".reg_c").hide();
        });

        $(".close,.overlay").click(function(){
            $(".login, .overlay, .limit").removeClass("pop_in");
        })
    })

    function resetLoginForm() {
        $(":input","#loginForm")
        .not(":button",":reset","hidden","submit")
        .val("")
        .removeAttr("checked")
        .removeAttr("selected");

        $(":input","#regForm")
        .not(":button",":reset","hidden","submit")
        .val("")
        .removeAttr("checked")
        .removeAttr("selected");
    }
</script>
